{% extends 'layout/basic.html' %}
{% load static %}
{% block title %} 支付订单 {% endblock %}

{% block content %}

    <div class="container">
        <nav aria-label="...">
                    <ul class="pagination" style="margin-top: 0;">
                        {{ page_html|safe }}
                    </ul>
        </nav>
        <table class="table table-hover">


            <thead>
            <tr>
                <th></th>
                <th>商品类型</th>
                <th>单价</th>
                <th>数量</th>
                <th>原价</th>
                <th>实际支付</th>
                <th>是否支付</th>
                <th>操作</th>
            </tr>
            <tbody id="rowList">
            <div>
                {% for order in order_list %}
                    {% if order.t_price.category == 2 %}
                        <tr>
                            <td><input type="checkbox" fid="{{ order.id }}"></td>
                            <td>
                                {{ order.t_price.title }}
                            </td>
                            <td>
                                {{ order.t_pay }}

                            </td>
                            <td>{{ order.t_number }}</td>
                            <td>100</td>
                            <td>
                                {{ order.t_pay }}
                            </td>
                            <td>
                                {% if order.t_status == 2 %}
                                    已支付
                                {% else %}
                                    <a class="btn btn-primary"
                                       href="{% url "websass:trade_pay"  policy_id=order.id %}">未支付</a>
                                {% endif %}

                            </td>
                            <td>
                                <a class="btn btn-danger btn-xs"
                                   data-toggle="modal"
                                   data-fid="{{ order.id }}"
                                   data-target="#alertModal"
                                >
                                    <i class="fa fa-trash" aria-hidden="true"></i>
                                </a>
                            </td>
                        </tr>
                    {% endif %}
                {% endfor %}

            </div>
            </tbody>
            </thead>
        </table>

    </div>
    <div class="modal fade" id="alertModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="alert alert-danger alert-dismissible fade in" role="alert">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">×</span></button>
                <h4>是否确定删除订单？</h4>
                <p style="padding-top: 20px;padding-bottom: 20px;">删除之后订单无法找回哦，谨慎删除！！！</p>
                <p style="text-align: right;">
                    <a class="btn btn-default btn-sm" data-dismiss="modal" aria-label="Close">取 消</a>
                    &nbsp;
                    <button id="btnDelete" type="button" class="btn btn-danger btn-sm">确 定</button>
                </p>
            </div>
        </div>

    </div>
{% endblock %}
{% block js %}
    <script>
        var DELETE_ORDER = "{% url 'websass:delete_order'%}";
        $(function () {
            deleteOrder();
            AddModel();
        });

        function deleteOrder() {
            $("#btnDelete").click(function () {
                $.ajax({
                    url: DELETE_ORDER,
                    type: "GET",
                    data: {fid: $(this).attr("fid")},
                    success: function (res) {
                        if (res.status) {
                            location.href = location.href
                            console.log($(this).attr("data-fid"))

                        }
                    }
                })
            })
        }

        function AddModel() {
            $("#alertModal").on("show.bs.modal", function (event) {
                var button = $(event.relatedTarget);
                var fid = button.data("fid");
                $("#btnDelete").attr("fid", fid)
            })
        }
    </script>
{% endblock %}